<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="http://d3js.org/d3.v3.min.js"></script>
</head>
<body>


<script>
    var data1=[10,20,30,40,50,60]
    <!--var canvas = d3.select("body")-->
                  <!--.append("svg")-->
                  <!--.attr("width",500)-->
                  <!--.attr("height",500);-->

    <!--var circle1 = canvas.append("circle")-->
                         <!--.attr("cx",50)-->
                         <!--.attr("cy",120)-->
                         <!--.attr("r",20);-->

    <!--circle1.transition()-->
            <!--.duration(3000)-->
            <!--.attr("cx",200)-->
            <!--.delay(2000)-->
            <!--.transition()-->
            <!--.duration(3000)-->
            <!--.attr("cx",400)-->
            <!--.each("start",function () { d3.select(this).attr("fill","blue");}  )-->
            <!--.transition()-->
            <!--.duration(3000)-->
            <!--.attr("cy",400)-->
            <!--.each("start",function () { d3.select(this).attr("fill","red");}  )-->

</script>

</body>
</html>